//该文件专门用于创建整个应用的路由器
import VueRouter from 'vue-router'

import About from '../pages/About'
import Home from '../pages/Home'
import New from '../pages/New'
import Message from '../pages/Message'
import Detail from '../pages/Detail'
//创建一个路由器
const router = new VueRouter({
    //更改路由模式
    mode: 'history',
    routes: [{
            name: 'aboutpage',
            path: '/about',
            component: About
        },
        {
            name: 'mainpage',
            path: '/home',
            component: Home,
            children: [{
                    name: 'newspage',
                    path: 'news',
                    component: New
                },
                {
                    name: 'messagepage',
                    path: 'message',
                    component: Message,
                    children: [{
                        name: 'detailpage',
                        path: 'detail',
                        component: Detail,
                        meta: {
                            isAuth: true
                        },
                        // beforeEnter: (to, from, next) => {
                        //     console.log(to, from);
                        //     next()
                        // },

                        //props第二种写法(只能用params),值为布尔值，若布尔值为真，就会把该路由组件收到的所有params参数，以props的形式传递给Detail组件
                        // props: true

                        //props的第三种写法，值为函数
                        props($route) {
                            return {
                                id: $route.query.id,
                                title: $route.query.title
                            }
                        }
                    }]
                }
            ]
        }

    ]
})

//全局前置路由守卫——初始化调用，每次路由切换之前被调用
// router.beforeEach((to, from, next) => {

//     console.log('前置路由守卫', to, from);
//     if (to.meta.isAuth) {
//         if (to.name !== 'detailpage')
//             next()
//     } else {
//         next()
//     }
// })

//全局前置路由守卫——初始化调用，每次路由切换之后被调用
// router.afterEach((to, from) => {
//     document.title = to.name || '达拉崩吧'
//     console.log('后置路由守卫', to, from);
// })

//独享守卫


export default router